<template lang="pug">
view
	swiper(:indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" style="height:300px")
		swiper-item
			image(
				src="/static/logo.png",
				mode="widthFix",
				style="width:100%;"
			)
	view.bg.bf
		view.title.c3.f16.flex
			view 血压仪
			view.ml
				image(
					src="/static/fx.png",
					mode="widthFix",
					style="width:16px;"
				)
		view.c9.f12.flex.mt10
			view 库存：500
			view 已售：269件
	view.bf.bg.mt10
		view.w50(style="margin:auto")
			<u-divider text="商品详情"></u-divider>
		view
			u-parse(
				:content="content"
			)
	view(style="height:50px")
	view.pof.b0.l0.w100
		<uni-goods-nav :fill="true"  :options="options" :buttonGroup="buttonGroup"  @click="onClick" @buttonClick="buttonClick" />
</template>

<script>
	export default {
		data() {
			return {
				list1: [
					'/static/logo.png',
					'/static/logo.png',
					'/static/logo.png'
				],
				content: `
					<p>露从今夜白，月是故乡明</p>
					<img src="https://cdn.uviewui.com/uview/swiper/2.jpg" />
				`,
				 options: [{
							icon: 'headphones',
							text: '客服'
						}, {
							icon: 'shop',
							text: '店铺',
						}, {
							icon: 'cart',
							text: '购物车',
							info: 2
						}],
					    buttonGroup: [{
					      text: '加入购物车',
					      backgroundColor: '#ff0000',
					      color: '#fff'
					    },
					    {
					      text: '立即购买',
					      backgroundColor: '#ffa200',
					      color: '#fff'
					    },
						]
				
			}
		},
		methods: {
			  onClick (e) {
				uni.showToast({
				  title: `点击${e.content.text}`,
				  icon: 'none'
				})
			  },
			  buttonClick (e) {
				console.log(e)
				if(e.index==1){
					uni.navigateTo({
						url:'/pages/goodslist/goodslist'
					})
				}
				this.options[2].info++
			  }
	}
	}
</script>

<style>
/* .u-swiper__wrapper{
	height: 300px !important;
} */
page{
	background: #f9f9f9;
}
</style>
